<template>
  <div class="fillcontain">

    <div class="bus_b">

        <h2 class="title">告警管理</h2>
        <el-tabs v-model="activeName" @tab-click="tabClick">
            <el-tab-pane label="告警事件" name="alarmEvent">
            </el-tab-pane>
            <el-tab-pane label="告警规则" name="alarmRule">
            </el-tab-pane>
        </el-tabs>

    </div>
      <component :is="curComp"></component>
  </div>
</template>
<script>
import AlarmEvent from './alarmEvent.vue'
import AlarmRule from './alarmRule.vue'
export default {
  data() {
    return {
        activeName: 'alarmEvent',
        curComp: 'AlarmEvent'
    };
  },
  components: {AlarmEvent, AlarmRule},
  methods: {
      tabClick(tab, event) {
         tab.name == 'alarmEvent' ? this.curComp = 'AlarmEvent' : this.curComp = 'AlarmRule'
      }
  }
};
</script>
<style lang="less" scoped>
@import "../../style/table.less";
</style>

